上篇介紹了註冊,相對的就一定要來介紹登入的功能。在資料庫上定義了 username, userpass 的欄位,登入的時候就在頁面上擺上兩個輸入框,以及登入的按鈕。
在上一篇已經有建立好 models 的部分,在登入的操作也需要透過 models 向資料庫做存取,請打開 /models/user.js
//檢查是否為會員
User.getUserNumByName = function getUserNumByName(username, callback) {
//使用username 來檢查是否有資料
var cmd = “select COUNT(1) AS num from user info where username = ?";
connection.query(cmd, [username], function (err, result) {
if (err) {
return;
}
connection.release();
//查詢結果使用 callback 呼叫,並將 err, result 參數帶入
callback(err,result);
});
};
//透過帳號取得使用者資料
User.getUserByUserName = function getUserNumByName(username, callback) {
var cmd = “select * from userinfo where username = ?";
connection.query(cmd, [username], function (err, result) {
if (err) {
return;
}
connection.release();
callback(err,result);
});
};
然後請在 routes/ 資料夾 (如果沒有請自行建立)新增 login.js 檔案,在這檔案要特別注意的是,當登入表單送出的時候,如果是會員的話,那麼在登入進到主頁時,將使用者帳號寫到 session 上面
var express = require('express'),
User = require('../models/user.js'),
router = express.Router(),
crypto = require('crypto'),
title = '登入';
router.get('/', function(req, res) {
res.render('login', {title:title});
});
router.post('/', function(req, res) {
var userName = req.body['txtUserName'],
userPwd = req.body['txtUserPwd'],
md5 = crypto.createHash('md5');
User.getUserByUserName(userName, function (err, results) {
if(results == '') {
res.locals.error = '使用者不存在';
res.render('login',{title:title});
return;
}
userPwd = md5.update(userPwd).digest('hex');
if(results[0].UserName != userName || results[0].UserPass != userPwd) {
res.locals.error = '使用者帳號或密碼錯誤';
res.render('login',{title:title});
return;
} else {
res.locals.username = userName;
//設定session
req.session.username = res.locals.username;
console.log(req.session.username);
res.redirect('/');
return;
}
});
});
module.exports = router;
一切基本動作準備好之後,接著就打開 app.js 新增 login 的 router 路由,而這個路由將真的表單的請求作處理,在以下的兩行程式所代表的是指定載入路由的寫法。
var login = require('./routes/login’);
app.use('/login', login);
view 檢視 請在 /views/ 建立 index.ejs
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= title %></title>
<link rel="stylesheet" type="text/css" href="/stylesheets/bootstrap.min.css" />
<div class="container">
<% if (locals.username) { %>
<h1>您好, <%= username %></h1>
<a href="/logout">登出</a>
<% } %>
</div>
已知註冊的帳號密碼是 test / 123456 ,那麼就在表單輸入帳密,結果如下:
登出
有了登入之後,也別忘了登出,登出的寫法也相當容易,由於本章節是將註冊的帳號用 session 保存,而登出只需要將 session 銷毀即可,銷毀之後,再退到登入頁面。程式如下:
var express = require('express'),
router = express.Router();
router.get('/', function(req, res) {
req.session.destroy();
res.redirect('/login');
});
module.exports = router;
參考資料:
http://stackoverflow.com/questions/22994589/nodejs-express-routes-and-mysql
http://stackoverflow.com/questions/7990890/how-to-implement-login-auth-in-node-js